<!--客户管理-->
<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<link href="../css/mui.min.css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="../css/order.css"/>
</head>
<body class="gray">
	<div class="mui-scroll-wrapper" id="refreshContainer">
	    <div class="mui-scroll loading" id="vueMain">
	    		<template v-for="(item, index) in list">
	    			<ul class="mui-table-view client" >
			        <li class="mui-table-view-cell mui-media">
			        		<a href="javascript:;">
		    		            <img class="mui-media-object mui-pull-left" :src="item.head_img" />
		    		            <div class="mui-media-body">
		    		                <div class="name">客户名称：{{item.name}}</div>
		    		                <p>联系电话：{{item.mobile}}</p>
		    		                <p>累计成交：¥ {{item.sum_money}}</p>
		    		                <!--<button type="button" class="mui-btn mui-btn-outlined bexta-btn bexta-btn-red mui-pull-right">历史订单</button>-->
		    		            </div>
		    		        </a>
			        </li>
		    		</ul>
	    		</template>
	    </div>
	</div>
	
<script src="../js/mui.js"></script>
<script src="../js/vue.min.js"></script>
<script src="../js/mui.pullToRefresh.js"></script>
<script src="../js/mui.pullToRefresh.material.js"></script>
<script src="../js/bexta.js"></script>
<script type="text/javascript">
	var apps, views, merchant, first = 0, last = 10;
//	mui.init({
//	  	pullRefresh : {
//	    		container:"#refreshContainer",
//		    up : {
//		      	height:50,
//		      	auto:false,
//		      	contentrefresh : "正在加载...",
//		      	contentnomore:'没有更多数据了',
//		      	callback :function(){
//		      		this.endPullupToRefresh(true);
//		      	}
//		    }
//	  	}
//	});
//	mui('.mui-scroll-wrapper').scroll();
	
	mui.plusReady(function () {
	   views = bexta.getWebview();
	   merchant = bexta.getStorage(MERCHANT);
	   bexta.ajax(api.client_list, function(res){
	   		initVue(res);
	   }, {data:{uid:merchant.uid, firstrow:first, listrow:last}});
	});
	function initVue(res){
		apps = new Vue({
			el:"#vueMain",
			data:{
				list:res,
				first:res.length,
				last:last
			},
			mounted:function(){
				document.querySelector('.loading').classList.add('loadRun');
				var self = this;
				mui.init({
				  	pullRefresh : {
				    		container:"#refreshContainer",
				    		down:{
				    			height:50,
				    			auto:false,
				    			callback:function(){
				    				 bexta.ajax(api.client_list, function(res){ 
				    				 	self.list = res;
				    				 	mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
				    				 }, {data:{uid:merchant.uid, firstrow:0, listrow:self.first}});
				    			}
				    		},
					    up : {
					      	height:50,
					      	auto:false,
					      	contentrefresh : "正在加载...",
					      	contentnomore:'没有更多数据了',
					      	callback :function(){
					      		var that = this;
					      		bexta.ajax(api.client_list, function(res){
					      			var len = res.length;
					      			if( len == 0 || len < self.last ){
					      				that.endPullupToRefresh(true);
					      			}else{
					      				that.endPullupToRefresh(false);
					      			}
					      			if( len > 0 ){
					      				mui.each(res, function(){
					      					self.list.push(this);
					      				});
					      				self.first += len;
					      			}
					      		}, {data:{uid:merchant.uid, firstrow:self.first, listrow:self.last}})
					      	}
					    }
				  	}
				});
			}
		});
	}
	
</script>
</body>
</html>